<template>
    <div>
        <!-- 组件调用示例
            <StaffOneSearch @chooseCallBack="getChooseResult">
            <a slot="chooseTxt">设为管理员</a>
            </StaffOneSearch>
      -->
        <p>
            <a-input-search placeholder="搜索人员编号或姓名..." v-model.lazy="keyword" enter-button @search="onSearch"/>
        </p>
        <a-list
                :loading="loading"
                item-layout="horizontal"
                :data-source="dataSource"
                :pagination="pagination"
        >
            <a-list-item slot="renderItem" slot-scope="item, index">
                <a slot="actions" @click="onChoose(item)">
                    <slot name="chooseTxt">选择</slot>
                </a>
                <a-list-item-meta
                        :description="'人员编号: '+item.code"
                >
                    <a slot="title" href="#">{{item.name}}</a>
                    <a-avatar slot="avatar" :src="item.avatar" />
                </a-list-item-meta>
            </a-list-item>
        </a-list>
    </div>
</template>
<script>
    import {staffByKeyword} from '../../../util/internal.api';
    import {pagination} from '../public/colums.js';
    export default {
        data() {
            return {
                keyword: "",
                loading: false,
                dataSource: [],
                pagination: {
                    ...pagination,
                    pageSize: 5,
                    onChange: current => {
                        this.pagination.current = current;
                        this.getList();
                    }
                },
            };
        },
        methods: {
            onSearch() {
                if (this.keyword.length <= 0) {
                    this.$message.warning('请设置人员的搜索关键字....');
                    return false;
                }
                this.data = [];
                this.loading = true;
                this.pagination.pageSize = 5; //每页条数
                this.pagination.current = 1; //当前页
                this.getList();
            },
            getList() {
                if(this.keyword===""){
                    this.dataSource=[];
                    this.pagination.current=1;
                }else{
                    staffByKeyword(this.pagination, this.keyword).then(res => {
                        this.loading = false;
                        if (res.code === 0) {
                            this.dataSource = res.data.result; //表格数据
                            this.pagination.total = res.data.total; //总记录条数
                        }
                    });
                }
            },
            onChoose(item) {
                this.$emit("chooseCallBack", item);
            }
        },
    };
</script>